<template>
        <div class="container-fluid px-lg-5 px-3">
            <nav class="py-2 d-lg-flex">
                <div id="logo">
                    <h1><a class="navbar-brand logo" href="index.html">
                                {{name}}
                        </a></h1>
                </div>
                <label for="drop" class="toggle">Menu</label>
                <input type="checkbox" id="drop" />
                <ul class="menu ml-auto">
                    <li :class="tabName == 'resumePool'&&'active'"><a href="javascript:void(0)" @click="toWhere('resumePool')">简历池</a></li>
                    <li :class="tabName == 'publicJob'&&'active'"><a href="javascript:void(0)" @click="toWhere('publicJob')">发布职位</a></li>
                    <li>
                        <label for="drop-2" class="toggle">Dropdown <span class="fa fa-angle-down" aria-hidden="true"></span> </label>
                        <a href="javascript:void(0)">企业中心<span class="fa fa-angle-down" aria-hidden="true"></span></a>
                        <input type="checkbox" id="drop-2" />
                        <ul class="inner-ul">
                            <li :class="tabName == 'companyInfo' && 'active'"><a href="javascript:void(0)"  @click="toWhere('companyInfo')">我的中心</a></li>
                            <li :class="tabName == 'resumeMsgIndex' && 'active'"><a href="javascript:void(0)" @click="toWhere('resumeMsgIndex')">我的消息</a></li>
                            <li :class="tabName == 'equityMain' && 'active'"><a href="javascript:void(0)" @click="toWhere('equityMain')">我的权益</a></li>
                        </ul>
                    </li>
                    <li><a href="javascript:void(0)" @click="toWhere('recuitIndex')">返回求职端</a></li>
                </ul>
            </nav>
        </div>
</template>

<script>
import {mapState,mapActions,mapGetters} from 'vuex'

export default {
  name: "companyHeader",
  data() {
    return {
        name:localStorage.getItem('name')
    };
  },
  computed:{
      ...mapState({
        tabName:state=>state.tabName
      })
  },
  components: {},
  beforeCreate() {},
  created() {},
  beforeMount() {},
  mounted() {
  },
  beforeUpdate() {},
  updated() {},
  beforeDestroy() {},
  destroy() {},
  methods:{
      toWhere(name){
          this.$store.dispatch('changeTabName',name)
          this.$router.push({ name})
      },
  }
};
</script>

<style scoped lang="less">
@import "./../../public/less/header_footer.less";
</style>
